import { HTMLAttributes, ReactNode } from 'react';
import PickerCascade from './PickerCascade';
import PickerMulti from './PickerMulti';

export type PickerValue = string | number;

export interface PickerDataNames {
	label?: string;
	value?: string;
	children?: string;
}

export interface PickerOption {
	label?: ReactNode;
	value?: PickerValue;
	// for custom filed names
	[key: string]: any;
}

export interface PickerBaseProps {
	optionHeight?: number | string;
	visibleOptionsCount?: number;
	transitionDuration?: number;
	toolbar?: ReactNode;
	toolbarPosition?: 'top' | 'bottom';
	title?: ReactNode;
	confirmButton?: ReactNode;
	cancelButton?: ReactNode;
	loading?: boolean;
}

export type PickerElementProps = Omit<
	HTMLAttributes<HTMLDivElement>,
	'defaultValue' | 'onChange' | 'title'
>;

export interface PickerComponentProps extends PickerBaseProps {
	defaultValue?: PickerValue;
	data?: Array<PickerOption | PickerValue>;
	dataNames?: PickerDataNames;
	onChange?: (value: PickerValue, index: number) => void;
	onConfirm?: (value?: PickerValue) => void;
	onCancel?: (value?: PickerValue) => void;
}

export type PickerProps = PickerComponentProps & PickerElementProps;

export interface PickerRef {
	root: HTMLDivElement | null;
	getValue: () => PickerValue | undefined;
}

export interface PickerMultiComponentProps extends PickerBaseProps {
	defaultValue?: Array<PickerValue | undefined>;
	data?: Array<Array<PickerOption | PickerValue>>;
	dataNames?: PickerDataNames;
	onChange?: (value: Array<PickerValue | undefined>) => void;
	onConfirm?: (value: Array<PickerValue | undefined>) => void;
	onCancel?: (value: Array<PickerValue | undefined>) => void;
}

export type PickerMultiProps = PickerMultiComponentProps & PickerElementProps;

export interface PickerMultiRef {
	root: HTMLDivElement | null;
	getValue: () => Array<PickerValue | undefined>;
}

export interface PickerCascadeComponentProps extends PickerBaseProps {
	defaultValue?: Array<PickerValue | undefined>;
	data?: PickerOption[];
	dataNames?: PickerDataNames;
	onChange?: (value: Array<PickerValue | undefined>) => void;
	onConfirm?: (value: Array<PickerValue | undefined>) => void;
	onCancel?: (value: Array<PickerValue | undefined>) => void;
	cascadeSize?: number;
}

export type PickerCascadeProps = PickerCascadeComponentProps &
	PickerElementProps;

export interface PickerCascadeRef {
	root: HTMLDivElement | null;
	getValue: () => Array<PickerValue | undefined>;
}

export interface PickerExportExtra {
	Multi: typeof PickerMulti;
	Cascade: typeof PickerCascade;
}
